$(function () {
  //页面结构重新加载函数
  function pageinit() {
    $.ajax({
      type: 'get',
      url: '/getAllCate',
      dataType: 'json',
      success: function (res) {
        console.log(res);
        $('tbody').html(template('cateTemp', res))
      }
    })
  };
  //
  pageinit();
  //实现内容的展示
  $('tbody').on('click', '.btnedit', function () {
    // 使用自定义属性的意义在于获取数据的时候可以直接获取到对象
    let obj = $(this).data()
    console.log(obj)
    $('#id').val(obj.id)
    $('#name').val(obj.name)
    $('#slug').val(obj.slug)
    $('.optinfo').text('编辑分类数据')
    $('.btnAdd').hide()
    $('.btnEdit').show()
  });
  //实现分类的编辑
  $('.btnEdit').on('click', function () {
    let id = $('#id').val()
    let name = $('#name').val()
    let slug = $('#slug').val()
    let obj = { id, name, slug }
    $.ajax({
      type: 'post',
      url: '/editCateById',
      data: obj,
      dataType: 'json',
      success: function (res) {
        if (res.code == 200) {
          $('#id').val('');
          $('#name').val('');
          $('#slug').val('');
          $('.optinfo').text('添加新分类目录')
          $('.btnAdd').show();
          $('.btnEdit').hide();
          pageinit();
        }
      }
    })
  })
  //实现分类的删除(单个)
  $('tbody').on('click', '.btndel', function () {
    let id = $(this).data('id');
    if (confirm('确认是否删除?')) {
      $.ajax({
        type: 'get',
        url: '/delCateById',
        data: { id },
        dataType: 'json',
        success: function (res) {
          if (res.code == 200) {
            $('.alert-danger > span').text(res.msg)
            $('.alert-danger').fadeIn(500).delay(3000).fadeOut(500);
            pageinit();
          }
        }
      })
    }

  })
  //实现分类的添加
  $('.btnAdd').on('click', function () {
    let name = $('#name').val();
    let slug = $('#slug').val();
    let data = {
      name,
      slug
    }
    $.ajax({
      type: 'post',
      url: '/addCate',
      dataType: 'json',
      data,
      success: function (res) {
        if (res.code == 200) {
          $('#id').val('');
          $('#name').val('');
          $('#slug').val('');
          pageinit();
        }
      }
    })
  })
  //实现分类的删除(批量)

  $('.ckAll').on('click', function () {
    $('tbody .ckSingle').prop('checked', $('.ckAll').prop('checked'));
    if ($('tbody .ckSingle:checked').length > 1) {
      $('.btndels').fadeIn(500);
    } else {
      $('.btndels').fadeOut(500);
    }
  })

  $('tbody').on('click', '.ckSingle', function () {
    // 1.被选中的所有复选框的数量
    let cnt = $('tbody .ckSingle:checked').length
    // 2.所有复选框的数量
    let total = $('tbody .ckSingle').length
    // 3.判断是否显示批量删除
    if (cnt > 1) {
      $('.btndels').fadeIn(500)
    } else {
      $('.btndels').fadeOut(500)
    }
    // 4.判断全选
    if (cnt == total) {
      $('.ckAll').prop('checked', true)
    } else {
      $('.ckAll').prop('checked', false)
    }
  })

  $('.btndels').on('click', function () {
    if (confirm('请问是否真的需要删除？')) {
      //1. 获取选中的复选框
      let cks = $('tbody .ckSingle:checked');
      let ids = [];
      //2.获取选中的复选框的id
      for (let i = 0; i < cks.length; i++) {
        ids.push(cks[i].dataset['id'])
      }
      //3. 发送请求
      $.ajax({
        url: '/delCateById?id=' + ids,
        dataType: 'json',
        success: function (res) {
          console.log(res);
          if (res.code == 200) {
            $('.alert-danger > span').text(res.msg)
            $('.alert-danger').fadeIn(500).delay(3000).fadeOut(500);
            pageinit();
          }
        }
      })
    }
  })
})
